<!--
 * @Descripttion: 操作提醒
 * @version: v1.0.0
 * @Author: wang pingqi
 * @Date: 2021-05-18 14:51:26
 * @LastEditors: wang pingqi
 * @LastEditTime: 2022-04-19 15:57:25
-->
<template>
  <KiFormDialog
    :show.sync="form.show"
    title="操作提醒"
    class="form-dialog"
    v-model="formData"
    ref="remindDialog"
  >
    <div class="content">
      <p>
        当前商品为已入住状态，执行退款操作后会向支付系统发起申请，请提前具备如下条件，否则会退款失败。
      </p>
      <p>1、支付渠道已授权平台API退款</p>
      <p>2、银行卡中有余额足够退款</p>
      <p>3、当前退款不会改变订单状态，仍为已入住状态，请确定是否退款？</p>
    </div>

    <el-checkbox v-model="formData.agree" style="font-weight: bold">
      我已知晓并认同平台退款规则
    </el-checkbox>
    <div slot="footer" class="footer">
      <el-button @click="onCancel"> 取 消 </el-button>
      <el-button type="primary" @click="onConfirm" :loading="form.loading" :disabled="!formData.agree">
        确 定
      </el-button>
    </div>
  </KiFormDialog>
</template>

<script>
export default {
  props: {
    form: {
      type: Object,
      required: true,
      default() {
        return {
          show: false,
          data: null,
          loading: false,
        };
      },
    },
  },
  data() {
    return {
      formData: {
        agree: false,
      },
    };
  },
  methods: {
    onCancel() {
      this.$set(this.form, "show", false);
    },
    onConfirm() {
      if (this.formData.agree) {
        this.$set(this.form, "show", false);
        this.$emit("ok",this.form.data);
      } else {
        this.$swal.error("请先阅读并同意平台退款规则");
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.form-dialog {
  .content {
    margin-bottom: 48px;
  }
}
</style>
